<template>
	<view class="page">

		<view class="header_box">
			<back :title="'我的'" :isBg="false"></back>


			<view class="header_box">
				<view class="tx_box">
					<image v-if="logout" @click="goSet" class="ty_pic" src="https://rubbish.lwjcg.com/static/index/tx.png"
						mode="scaleToFill" />
					<image v-else class="zs_pic" @click="goSet" :src="userinfo.avatar" mode="scaleToFill" />
				</view>
				<view class="head_right_box" @click="goLogin" v-if="logout">
					<view class="top_head_r_b">
						登录/注册
					</view>
					<view class="bot_head_r_b">
						点击登录注册
					</view>
				</view>
				<view class="head_right_box" v-else>
					<view class="top_head_r_b">
						{{ userinfo.nickname }}
					</view>
					<!-- <view class="bot_head_r_b" @click="goSet">
						<text style="margin-right: 10rpx;">更多设置</text><u-icon color="rgba(199, 199, 199, 1)" size="26"
							name="arrow-right"></u-icon>
					</view> -->
				</view>
			</view>


			<view class="wallet_box">
				<view class="dingdan_top_box">
					<view class="left_box">我的订单</view>
					<view class="rt_box" @click="seeAll(seeAlls)">{{ seeAlls.text }}<u-icon style="margin-left: 10rpx;"
							name="arrow-right" color="rgba(199, 199, 199, 1)" size="24"></u-icon></view>
				</view>

				<view class="ddyemian_box">
					<view class="dd_big_box" v-for="(item, index) in orderBtnList" :key="index" @click="seeAll(item)">
						<view class="ddtop_box">
							<image :src="item.icon" mode="scaleToFill" />
							<!-- <view class="jiaobiao" v-if="item.num > 0">{{ item.num }}</view> -->
							<view class="jiaobiao" :class="item.num.toString().length > 1 ? 'jiaobiao1_box' : ''"
								v-if="item.num > 0">{{ item.num }}</view>
						</view>
						<view class="ddbot_box">{{ item.text }}</view>
					</view>
				</view>
			</view>

			<!-- 更多服务 -->
			<view class="help_box" v-if="userinfo.flag == 1">
				<view class="help_title_box">
					更多服务
				</view>

				<view class="big_gn_box">
					<view  class="gn_box" v-for="(item, index) in helpList1" :key="index" @click="jump(item, index)">
						<view class="gn_t_box" :class="'gn_t_box_' + index">
							<image :src="item.img" mode="scaleToFill" />
						</view>
						<view class="gn_b_box">
							{{ item.text }}
						</view>
					</view>
					<view style="width: 23%;" v-for="(item) in 3"></view>
				</view>
			</view>
			<view class="help_box" v-else>
				<view class="help_title_box">
					更多服务
				</view>

				<view class="big_gn_box">
					<view  class="gn_box" v-for="(item, index) in helpList" :key="index" @click="jump(item, index)">
						<view class="gn_t_box" :class="'gn_t_box_' + index">
							<image :src="item.img" mode="scaleToFill" />
						</view>
						<view class="gn_b_box">
							{{ item.text }}
						</view>
					</view>
					<view style="width: 23%;" v-for="(item) in 3"></view>
				</view>
			</view>
			
		</view>

	</view>
</template>
<script>
import back from "@/components/goback/goback"
export default {
	components: {
		back
	},
	data() {
		return {
			userinfo: {},
			logout: false,
			seeAlls: {
				id: -2,
				text: '查看全部',
			},
			orderBtnList: [
				{
					id: 1,
					icon: 'https://rubbish.lwjcg.com/static/order/dzf.png',
					text: '待支付',
					num: '0',
				},
				{
					id: 2,
					icon: 'https://rubbish.lwjcg.com/static/order/dkc.png',
					text: '待勘察',
					num: '0',
				},
				{
					id: 3,
					icon: 'https://rubbish.lwjcg.com/static/order/dqy.png',
					text: '待清运',
					num: '0',
				},
				{
					id: 5,
					icon: 'https://rubbish.lwjcg.com/static/order/ywc.png',
					text: '已完成',
					num: '0',
				},
				{
					id: -1,
					icon: 'https://rubbish.lwjcg.com/static/order/ytk.png',
					text: '已退款',
					num: '0',
				},
				{
					id: 0,
					icon: 'https://rubbish.lwjcg.com/static/order/yqx.png',
					text: '已取消',
					num: '0',
				}
			],//订单button按钮
			// 帮助列表
			helpList: [
				{
					img: 'https://rubbish.lwjcg.com/static/order/dzp.png',
					text: '地址簿',
					navUrl: '/userPage/directory/directory?userAddress=' + true
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/fx.png',
					text: '分销中心',
					navUrl: '/userPage/wallet/wallet'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/yhq.png',
					text: '优惠券',
					navUrl: '/userPage/coupon/coupon'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/yj.png',
					text: '意见反馈',
					navUrl: '/userPage/feedback/feedback',
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/kcy.png',
					text: '勘察员中心',
					navUrl: '/userPage/surveyor/surveyor',
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/gly.png',
					text: '管理员中心',
					navUrl: '/userPage/administrator/administrator'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/kf.png',
					text: '客服电话',
					navUrl: ''
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/sz.png',
					text: '设置',
					navUrl: '/userPage/setting/setting'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/cityhh.png',
					text: '城市合伙人',
					navUrl: '/userPage/partner/partner'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/xwxx.png',
					text: '发布信息',
					navUrl: '/userPage/information/meIndex'
				}
			],
			helpList1: [
				{
					img: 'https://rubbish.lwjcg.com/static/order/dzp.png',
					text: '地址簿',
					navUrl: '/userPage/directory/directory?userAddress=' + true
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/fx.png',
					text: '分销中心',
					navUrl: '/userPage/wallet/wallet'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/yhq.png',
					text: '优惠券',
					navUrl: '/userPage/coupon/coupon'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/yj.png',
					text: '意见反馈',
					navUrl: '/userPage/feedback/feedback',
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/kcy.png',
					text: '勘察员中心',
					navUrl: '/userPage/surveyor/surveyor',
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/gly.png',
					text: '管理员中心',
					navUrl: '/userPage/administrator/administrator'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/kf.png',
					text: '客服电话',
					navUrl: ''
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/sz.png',
					text: '设置',
					navUrl: '/userPage/setting/setting'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/cityhh.png',
					text: '城市合伙人',
					navUrl: '/userPage/partner/partner'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/xwxx.png',
					text: '发布信息',
					navUrl: '/userPage/information/meIndex'
				},
				{
					img: 'https://rubbish.lwjcg.com/static/order/bwl.png',
					text: '备忘录',
					navUrl: '/userPage/memorandum/memorandum'
				},
			]

		}
	},

	onShow() {
		this.isLogin()
		this.userStatistics()
	},
	methods: {

		seeAll(item) {
			console.log(item.id)
			uni.setStorageSync('active', item.id);
			uni.navigateTo({ url: '/orderPage/order/index' })
		},
		info() {
			// if()
			this.$Request.post(this.$api.user.info).then(res => {
				if (res.code == 200) {
					this.userinfo = res.data
					this.$store.state.userInfo = res.data
					uni.setStorageSync('user', JSON.stringify(res.data))
				}

			})
		},
		userStatistics() {
			this.$Request.post(this.$api.user.userStatistics).then(res => {
				if (res.code == 200) {
					this.orderBtnList.forEach((item, index) => {
						this.orderBtnList[index].num = res.data[index]
					});
				}

			})
		},
		goSet() {
			uni.navigateTo({
				url: '/userPage/setting/setting'
			})
		},
		// 判断用户是否登录
		isLogin() {
			if (uni.getStorageSync("USERINFO") == '') {
				this.logout = true//未登录状态
			} else {
				this.logout = false//登录状态
				this.info()//用户信息
			}
		},
		// 跳转登录
		goLogin() {
			uni.redirectTo({
				url: '/userPage/login/login'
			})
		},
		// 跳转
		jump(item, index) {
			this.$store.state.insterPep = {}
			console.log(index);
			if (index == 4) {
				if (this.userinfo.survey_id == 0) {
					uni.navigateTo({
						url: item.navUrl
					})
				} else if (this.userinfo.survey_id > 0) {
					this.$Request.post(this.$api.word.surveyApply).then(res => {
						if (res.code == 200) {
							uni.setStorageSync('survey_id', this.userinfo.survey_id)
							uni.navigateTo({
								url: '/orderPage/surveyorcenter?survey_id=' + this.userinfo.survey_id + '&mark=' + '0'
							})
						} else if (res.code == 400) {
							uni.navigateTo({
								url: '/userPage/surveyor/surveyor?autoCommit=' + true
							})
						}
					})


				}
			} else if (index == 6) {
				this.$Request.post(this.$api.user.systemPhone).then(res => {
					if (res.code == 200) {
						this.phone(res.data.phone)
					}
				})
			} else if (index == 8) {

				if (this.userinfo.partner_id == 0) {
					uni.navigateTo({
						url: item.navUrl
					})
				} else if (this.userinfo.partner_id > 0) {
					this.$Request.post(this.$api.user.partnerApply).then(res => {
						if (res.code == 200) {
							uni.navigateTo({
								url: '/userPage/already/already'
							})
						} else if (res.code == 400) {
							uni.navigateTo({
								url: '/userPage/partner/partner?autoCommit=' + true
							})
						}
					})
				}
				// if (this.userinfo.partner_id > 0) {
				// 	this.$Request.post(this.$api.user.partnerApply).then(res => {
				// 		uni.navigateTo({
				// 			url: item.navUrl + '&autoCommit=' + true
				// 		})
				// 	})

				// } else {
				// 	uni.navigateTo({
				// 		url: item.navUrl1
				// 	})
				// }
			}
			else {
				uni.navigateTo({
					url: item.navUrl
				})
			}


		},
		phone(phone) {
			console.log(phone)
			const res = uni.getSystemInfoSync(); //获取当前的手机机型
			if (res.platform == 'ios') {
				uni.makePhoneCall({
					phoneNumber: phone
				})
			} else {
				uni.makePhoneCall({
					phoneNumber: phone,
				})
			}
		},
	}
}
</script>
<style lang="scss" scoped>
.page {
	width: 100vw;
	height: 100vh;
	background-color: rgba(246, 246, 246, 1);

	.header_box {
		width: 100%;
		height: 592rpx;
		background: linear-gradient(180deg, rgba(226, 244, 243, 1) 0%, rgba(231, 245, 228, 0) 100%);

		.header_box {
			width: 100%;
			height: 132rpx;
			margin-top: 30rpx;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			box-sizing: border-box;
			padding-left: 30rpx;
			margin-bottom: 48rpx;

			.tx_box {
				width: 132rpx;
				height: 132rpx;
				border-radius: 50%;
				background-color: rgba(177, 199, 189, 1);
				display: flex;
				justify-content: center;
				align-items: center;
				margin-right: 24rpx;

				.ty_pic {
					width: 75%;
					height: 75rpx;
				}

				.zs_pic {
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}

			.head_right_box {
				width: 430rpx;
				height: 131rpx;

				.top_head_r_b {
					width: 100%;
					height: 80rpx;
					margin-bottom: 8rpx;
					font-size: 32rpx;
					font-weight: 600;
					line-height: 100rpx;
					color: rgba(0, 0, 0, 1);
				}

				.bot_head_r_b {
					width: 100%;
					height: 34rpx;
					font-size: 24rpx;
					font-weight: 400;
					line-height: 34rpx;
					color: rgba(128, 128, 128, 1);
				}
			}
		}

		.wallet_box {
			width: 704rpx;
			height: 244rpx;
			border-radius: 28rpx;
			background: rgba(255, 255, 255, 1);
			margin: auto;
			box-sizing: border-box;
			padding: 40rpx 30rpx 0 30rpx;
			margin-bottom: 22rpx;

			.dingdan_top_box {
				width: 100%;
				height: 30rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 28rpx;

				.left_box {
					height: 30rpx;
					opacity: 1;
					font-size: 30rpx;
					font-weight: 600;
					line-height: 30rpx;
					color: rgba(51, 51, 51, 1);

				}

				.rt_box {
					height: 24rpx;
					opacity: 1;
					font-size: 24rpx;
					font-weight: 500;
					line-height: 24rpx;
					color: rgba(153, 153, 153, 1);
				}
			}

			.ddyemian_box {
				width: 100%;
				height: 110rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				.dd_big_box {
					height: 110rpx;
					width: 80rpx;

					.ddtop_box {
						width: 72rpx;
						height: 60rpx;
						margin-bottom: 20rpx;
						position: relative;

						image {
							width: 52rpx;
							height: 52rpx;
							display: block;
							margin: auto;
						}

						.jiaobiao {
							position: absolute;
							top: -12rpx;
							right: -6rpx;
							width: 32rpx;
							height: 32rpx;
							opacity: 1;
							border-radius: 50%;
							background: red;
							border: 2rpx solid rgba(255, 255, 255, 1);
							text-align: center;
							line-height: 27rpx;
							font-size: 20rpx;
							font-weight: 400;
							color: rgba(255, 255, 255, 1);

							&.jiaobiao1_box {
								width: 50rpx;
								height: 32rpx;
								opacity: 1;
								border-radius: 30rpx;
							}
						}
					}

					.ddbot_box {
						width: 80rpx;
						height: 24rpx;
						opacity: 1;
						font-size: 24rpx;
						font-weight: 400;
						line-height: 24rpx;
						color: rgba(56, 56, 56, 1);
						text-align: center;

					}
				}
			}
		}

		.help_box {
			width: 704rpx;
			border-radius: 28rpx;
			background: rgba(255, 255, 255, 1);
			margin: auto;
			box-sizing: border-box;
			padding: 28rpx 36rpx 0 36rpx;

			.help_title_box {
				height: 48rpx;
				font-size: 32rpx;
				font-weight: 600;
				line-height: 48rpx;
				color: rgba(0, 0, 0, 1);
				margin-bottom: 42rpx;
			}


			.big_gn_box {
				width: 100%;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;

				.gn_box {
					height: 146rpx;
					width: 23%;
					flex-shrink: 0;
					margin-bottom: 9rpx;

					.gn_t_box {
						width: 60rpx;
						height:60rpx;
						margin: auto;
						margin-bottom: 26rpx;

						&.gn_t_box_8 {
							width: 50rpx;
						}

						image {
							width: 100%;
							height: 100%;
						}
					}

					.gn_b_box {
						width: 100%;
						height: 38rpx;
						font-size: 26rpx;
						font-weight: 400;
						line-height: 38rpx;
						color: rgba(56, 56, 56, 1);
						text-align: center;
					}
				}
			}

		}
	}
}
</style>